<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

<head>
<meta charset="utf-8">
	<title>恒铸智能柜管理平台</title>
	<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
			<meta name="viewport"
				content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">

				<link rel="stylesheet"
					href="${pageContext.request.contextPath}/resources/MUI/css/mui.min.css">
					<link rel="stylesheet"
						href="${pageContext.request.contextPath}/resources/MUI/css/mui.picker.css">
						<link rel="stylesheet"
							href="${pageContext.request.contextPath}/resources/MUI/css/mui.poppicker.css">
							<script
								src="${pageContext.request.contextPath}/resources/MUI/js/mui.min.js"></script>
							<script
								src="${pageContext.request.contextPath}/resources/js/jquery-1.4.4.min.js"></script>
							<script
								src="${pageContext.request.contextPath}/resources/MUI/js/mui.picker.min.js"></script>
</head>
<style type="text/css">
.compRole select {
	width: 90px !important;
	float: left !important;
}

.compRole {
	height: 40px;
	z-index: 999;
	width: 95%;
	line-height: 40px;
	margin-left: 15px;
	position: relative;
	border-bottom: 1px solid #e4e3e6;
}

.compRole input {
	position: absolute;
	right: -30%;
}

.must {
	color: red;
	position: absolute;
	right: 10px;
	top: 12px;
}

.mui-input-group {
	margin-top: 50px;
}
</style>
<header class="mui-bar mui-bar-nav"> <a
	class="mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">管理员添加</h1>
</header>
<form class="mui-input-group">
	<div class="mui-input-row">
		<label>登录账号:</label> <input type="text" class="loginName"
			id="loginName" name="loginName" style="ime-mode: disabled;"
			placeholder="登录账号"> <span class="must">*</span>
	</div>
	<div class="mui-input-row">
		<label>真实姓名:</label> <input type="text" class="realName"
			name="realName" placeholder="真实姓名">
	</div>
	<div class="mui-input-row">
		<label>手机号码:</label> <input type="text" class="mobilePhone"
			name="mobilePhone" placeholder="请输入手机号码">
	</div>
	<div class="mui-input-row">
		<label>邮箱:</label> <input type="text" class="email" name="email"
			placeholder="请输入邮箱">
	</div>
	<div class="compRole">
		<label>公司角色:</label>
		<pre style="display: none;">${McompList}</pre>
		<input type="text" id="showCityPicker" readonly placeholder="公司-角色">
			<input type="text" class="compId" style="display: none;"
			name="compId" readonly> <input type="text" class="roleId"
				style="display: none;" name="roleId" readonly> <span
					class="must">*</span>
	</div>
	<div class="mui-button-row">
		<a type="button" class="mui-btn mui-btn-primary submit">提交</a>
	</div>
</form>
<script type="text/javascript">
		$(".mui-pull-left").on("touchstart",function(){
			history.back();
		})	
	
		//公司角色
		var cityPicker = new mui.PopPicker({
			layer: 2
		});
		data = $("pre").text();
		var obj = JSON.parse(data); 
		cityPicker.setData(obj);
		var showCityPickerButton = document.getElementById('showCityPicker');
		var cityResult = document.getElementById('cityResult');
		showCityPickerButton.addEventListener('tap', function(event) {
			cityPicker.show(function(items) {
				$(".compId").val(items[0].value);
				$(".roleId").val(items[1].value);
				$("#showCityPicker").val(items[0].text+"-"+items[1].text);
				//返回 false 可以阻止选择框的关闭
				//return false;
			});
		}, false);
	
	   $(".submit").on("touchstart",function(){
		   var param = $("form").serialize();

		    let loginName = $(".loginName").val();
	    	let compId = $(".compId").val();
	    	let roleId = $(".roleId").val();
	    	
	    	if(loginName !== "" && compId !== "" && roleId !== ""){
				$.post("/main/userAdd",param,function(res){
					
					if(res.success){
						mui.toast("添加成功");
						history.back();
			    	}else{
			    		mui.toast(res.message);
			    	}
					
				})
	    	}else{
	    		mui.toast("带 "+'<span style="color:red;">*</span> 为必填项');
	    	}
	   })
	</script>
</html>